<!doctype html>
<html>

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>Amaze UI Admin index Examples</title>
    <meta name="description" content="这是一个 index 页面">
    <meta name="keywords" content="index">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="renderer" content="webkit">
    <meta http-equiv="Cache-Control" content="no-siteapp" />
    <link rel="icon" type="image/png" href="${ctx}/static/i/favicon.png">
    <link rel="apple-touch-icon-precomposed" href="${ctx}/static/i/app-icon72x72@2x.png">
    <meta name="apple-mobile-web-app-title" content="Amaze UI" />
    <link rel="stylesheet" href="${ctx}/static/css/amazeui.min.css" />
    <link rel="stylesheet" href="${ctx}/static/css/admin.css">
    <link rel="stylesheet" href="${ctx}/static/css/app.css">
    <link rel="stylesheet" href="${ctx}/static/css/main.css">
    <link rel="stylesheet" href="${ctx}/static/ztree/zTreeStyle.css">
    <style type="text/css">
    body ol.am-breadcrumb {
      padding-top:0;
      margin:0;
      margin-bottom:10px;
}
    .return{
            width: 20px;
            margin-right: 10px;
        }
    .am-form-group{
        position: relative;
    }
    #distpicker{
      display: inline-block;
      width:79%;
    }
    .chance{
        display: inline-block;
        position: absolute;
        width: 100px;
        z-index: 99;
        top: 28px;
        height: 35px;
        right:0;
        color: #fff;
        background: #3bb4f2;
    }
   
    </style>
</head>

<body data-type="generalComponents">
            <ol class="am-breadcrumb">
                <img src="${ctx}/static/img/return.png" class="return"/>
                <li><a href="${ctx}/index" class="am-icon-home">首页</a></li>
               <!--  <li><a href="#">表单</a></li> -->
                <li class="am-active">个人资料</li>
            </ol>
            <div class="tpl-portlet-components">
               <!--  <div class="portlet-title">
                    <div class="tpl-portlet-input tpl-fz-ml">
                        <div class="portlet-input input-small input-inline">
                            <div class="input-icon right">
                                <i class="am-icon-search"></i>
                                <input type="text" class="form-control form-control-solid" placeholder="搜索..."> </div>
                        </div>
                    </div>


                </div> -->
                <div class="tpl-block ">

                    <div class="am-g tpl-amazeui-form" style="text-align: center;">
                        <div style="width:75%; margin:0 auto; text-align: left;font-size: 14px;">
                            <form data-href="${ctx}/user/editInfo" method="post" class="am-form" id="doc-vld-msg">
                                <fieldset>
                                  <div class="am-form-group">
                                    <label for="doc-vld-name-2-1">用户名：</label>
                                    <input type="text" id="doc-vld-name-2-1" minlength="3" name="username" value="${currentUser.username!}" readonly required/>
                                    <input type="hidden" name="userId" value="${currentUser.userId!}">
                                  </div>
                                 
                                  <div class="am-form-group">
                                    <label for="doc-vld-name-2-1">真实姓名：</label>
                                    <input type="text" id="doc-vld-name-2-2" minlength="3" name="name" value="${currentUser.name!}"  required/>
                                  </div>
                                  <div class="am-form-group" id="sexval" data-val="${currentUser.sex!}">
                                    <label>性别： </label>
                                    <label class="am-radio-inline">
                                      <input type="radio"  value="男" name="sex" required> 男
                                    </label>
                                    <label class="am-radio-inline">
                                      <input type="radio" name="sex" value="女"> 女
                                    </label>
                                  </div>
                                  <div class="am-form-group">
                                    <label for="doc-vld-age-2-1">年龄：</label>
                                    <input type="number" value="${currentUser.age!}" name="age" id="doc-vld-age-2-1" placeholder="输入年龄  12-120" min="12" max="120" required />
                                  </div>
                                <div class="am-form-group">
									<label for="doc-vld-age-2-1">手机号：</label> <input type="text"  name="phoneNumber" minlength="11" maxlength="11" value="${currentUser.phoneNumber!}" id="doc-vld-age-2-3" placeholder="手机号" required />
									</div>
									
                                  <div class="am-form-group">
                                    <label for="doc-vld-email-2-1">邮箱：</label>
                                    <input type="email" id="doc-vld-email-2-1" name="email"  value="${currentUser.email!}"  data-validation-message="请输入地球上的电子邮箱" placeholder="输入邮箱" required/>
                                  </div>
                              
                               <div class="am-form-group">
                                    <label for="doc-vld-name-2-1">身份证号：</label>
                                    <input type="text" id="doc-vld-name-2-3" minlength="18" maxlength="18" name="idCard" value="${currentUser.idCard!}"  required/>
                                  </div>
                                  
                                  <div class="am-form-group">
                                    <label for="doc-vld-email-2-1">出生日期：</label>
                                    <input type="text" class="am-form-field" name="birthday" value="${(currentUser.birthday?string('yyyy-MM-dd'))!}" placeholder="出生日期" data-am-datepicker  required />
                                  </div>
                                 <!--  <div class="am-form-group">
                                <label for="doc-select-3-1">地区选择</label>
                                        <div id="distpicker" data-toggle="distpicker">
                                            <select class="city"></select>
                                            <select class="city"></select>
                                            <select class="city"></select>
                                        </div>
                                  </div> -->
                                  <!-- <div class="am-form-group">
                                    <label for="doc-vld-ta-2-1">评论：</label>
                                    <textarea id="doc-vld-ta-2-1" minlength="10" maxlength="100"></textarea>
                                  </div> -->
                              
                                  <button class="am-btn am-btn-secondary" type="submit" >提交</button>
                                </fieldset>
                              </form>
                        </div>
                    </div>
                </div>

    </div>
    <div class="am-modal am-modal-alert" tabindex="-1" id="my-alert">
    	<div class="am-modal-dialog">
      		<div class="am-modal-hd">提示</div>
     		<div class="am-modal-bd"></div>
      		<div class="am-modal-footer">
       			 <span class="am-modal-btn">确定</span>
     		 </div>
   		</div>
  	</div>
    <!-- ztree层 -->

    <script type="text/javascript" src="${ctx}/static/js/jquery.min.js"></script>
    <script type="text/javascript" src="${ctx}/static/js/amazeui.min.js"></script>
    <script type="text/javascript" src="${ctx}/static/js/app.js"></script>
    <script type="text/javascript" src="${ctx}/static/js/form.js"></script>
    <script type="text/javascript" src="${ctx}/static/js/distpicker.data.min.js"></script>
    <script type="text/javascript" src="${ctx}/static/js/distpicker.min.js"></script>
    <script type="text/javascript" src="${ctx}/static/ztree/jquery.ztree.all.min.js"></script>
    <script type="text/javascript" src="${ctx}/static/ztree/jquery.ztree.core.min.js"></script>
    <script type="text/javascript" src="${ctx}/static/ztree/jquery.ztree.excheck.min.js"></script>
    <script type="text/javascript" src="${ctx}/static/ztree/jquery.ztree.exedit.min.js"></script>
    <script type="text/javascript" src="${ctx}/static/ztree/jquery.ztree.exhide.min.js"></script>
    <script src="${ctx}/static/js/public.js"></script>	
    <script>
        $(".return").click(function(){//返回上一页
                history.go(-1);
            });
        // 三级联动
        $('#distpicker').distpicker({
            province: '北京市',
            city: '北京市市辖区',
           district: '朝阳区'
        });
        //性别
        $(document).ready(function() {
            var val= $("#sexval").attr("data-val");

            if(val=="男"){
          	  $("#sexval").find("input").eq(0).attr("checked","checked");
            }
            if(val=="女"){
          	  $("#sexval").find("input").eq(1).attr("checked","checked");
            }
        });
        
        $(document).ready(function() {
	 		$('#doc-vld-msg').submit(function() {
	 			  var num =  $(".am-field-error").length; 
	 			if(num==0){
	 				var urls=$("#doc-vld-msg").attr("data-href");
	 				ajaxForm(urls);
	 			}
	 			return false;
			}); 
		});
        
       /*  function editInfo(){
        var form = new FormData(document.getElementById("doc-vld-msg"));
        $.ajax({
            url:"${ctx}/user/editInfo",
            type:"post",
            data:form,
            dataType : 'json',
            processData:false,
            contentType:false,
            cache : false,
			async : false,
            success:function(data){
            	console.log(data.message);
            },
            error:function(data){
            	console.log(data.message);
            }
        });  
        } */
    </script>
</body>

</html>